<template>
	<view class="editcar">
		<view class="info-box">
			<u-line color="#efefef" />
			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">车牌</view>
				</u-col>
				<u-col span="8"><input type="text" class="info-right" placeholder="请输入车牌" v-model="form.carNumber"></input></u-col>
			</u-row>
			<u-line color="#efefef" />
			<!-- 			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">型号</view>
				</u-col>
				<u-col span="8"><input type="text" class="info-right" placeholder="请输入" v-model="form.phone"></input></u-col>
			</u-row>
			<u-line color="#efefef" /> -->
			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">司机姓名</view>
				</u-col>
				<u-col span="8"><input type="text" class="info-right" placeholder="请输入司机姓名" v-model="form.driverName"></input></u-col>
			</u-row>
			<u-line color="#efefef" />
			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">联系电话</view>
				</u-col>
				<u-col span="8"><input type="text" class="info-right" placeholder="请输入联系电话" v-model="form.driverPhone"></input></u-col>
			</u-row>
			<u-line color="#efefef" />
			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">绑定设备</view>
				</u-col>
				<u-col span="8" style="display: flex;justify-content: flex-end;">
					<input v-model="form.iotId" class="info-right" placeholder="请输入设备编码" :clearable="true"/>
					<u-icon name="camera-fill" color="#00aaff" size="40rpx" @tap="photo()"></u-icon>
				</u-col>
			</u-row>
			<u-line color="#efefef" />
			<u-row gutter="0">
				<u-col span="4">
					<view class="info-left">修改图片</view>
				</u-col>
				<u-col span="8">
					<view class="up" style="display: flex;justify-content: flex-end;">
						<upImg dirUrl="car" @logo-cancel="canLogo" ref="upimg"></upImg>
					</view>
				</u-col>
			</u-row>
		</view>
		<view class="btn-box">
			<u-button class="btn-item" type="primary" @tap="edit">修改</u-button>
			<u-button class="btn-item" type="error" @tap="del">删除</u-button>
		</view>

	</view>
</template>

<script>
	import {
		updateCar,
		deleteCar
	} from '@/api/car.js'
	export default {
		data() {
			return {
				form: {},
				id: null
			};
		},
		onLoad(option) {
			this.id = option.id
			delete option.id
			this.form = { ...option}
			console.log(this.form);
		},
		methods: {
			canLogo(data){
				console.log(data);
				this.form.logo = data
			},
			del() {
				uni.showModal({
					title: '删除',
					content: '是否永久删除？',
					success: (res) => {
						if (res.confirm) {
							// console.log('用户点击确定');
							deleteCar(this.id).then(res => {
								console.log(res)
								uni.showToast({
									title: res.msg,
									icon: "none"
								})
								if (res.code !== 1) {
									return
								} else {
									setTimeout(() => {
										var item = true; //item为要传的值
										var pages = getCurrentPages();
										var prevPage = pages[pages.length - 3];
										prevPage.delete = item;
										uni.navigateBack({
											delta: 2
										})
									}, 500)
								}

							})

						} else if (res.cancel) {
							// console.log('用户点击取消');
							uni.showToast({
								title: "取消删除",
								icon: "none"
							})
							return
						}
					}
				});
			},
			edit() {
				uni.showModal({
					title: '修改',
					content: '是否修改信息？',
					success: (res) => {
						if (res.confirm) {
							this.$refs.upimg.update()
							// console.log('用户点击确定');
							updateCar(this.id, this.form).then(res => {
								console.log(res)
								uni.showToast({
									title: res.msg,
									icon: "none"
								})
								if (res.code !== 1) {
									return
								} else {
									setTimeout(() => {
										var item = true; //item为要传的值
										var pages = getCurrentPages();
										var prevPage = pages[pages.length - 3];
										prevPage.delete = item;
										uni.navigateBack({
											delta: 2
										})
									}, 500)
								}

							})

						} else if (res.cancel) {
							// console.log('用户点击取消');
							uni.showToast({
								title: "取消修改",
								icon: "none"
							})
							return
						}
					}
				});
			},
			photo(){
				// console.log(bool)
				uni.scanCode({
					scanType:['qrCode'],
				    success: (res) =>{
				        console.log('条码类型：' + res.scanType);
				        console.log('条码内容：' + res.result);
						this.form.iotId = res.result
				    },
					fail: err =>{
						uni.showToast({
							title: "扫码失败",
							icon: "none",
							duration: 2000
						})
					}
				});
			},
		},
	}
</script>

<style lang="scss">
	.editcar {
		padding: 0 20rpx;
	}

	.info-box {
		background-color: #ffffff;
		border-radius: 10rpx;
		margin-top: 40rpx;
		padding: 20rpx 40rpx;

		.info-left {
			font-size: 30rpx;
			font-weight: normal;
			font-stretch: normal;
			line-height: 40rpx;
			letter-spacing: 1rpx;
			color: #b1b8c8;
			padding: 20rpx 0px;
		}

		.info-right {
			font-size: 30rpx;
			font-weight: normal;
			font-stretch: normal;
			line-height: 40rpx;
			letter-spacing: 1rpx;
			color: #2c3240;
			text-align: right;
			font-weight: bold;
			padding: 20rpx 0px;
		}
	}

	.btn-box {
		// padding: 20rpx;
		padding-top: 60rpx;

		// padding-top: 70rpx;
		.btn-item {
			// margin-bottom: 40rpx;
			margin-top: 20rpx;
		}
	}
</style>
